{% extends 'base.html' %}
{% block pagewra %}
    <div class="page-wrapper">
        <!--page-content-wrapper-->
        <div class="page-content-wrapper">
            <div class="page-content">
                <div class="card radius-15">
                    <div class="card-body">
                        <div class="form-group">
                            <label>性别</label>
                            <select class="single-select" id="a1">
                                <option value="1">男</option>
                                <option value="0">女</option>
                            </select>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label>年龄</label>
                                <input id="a2" type="number" class="form-control radius-30"/>
                            </div>
                            <div class="form-group col-md-6">
                                <label>多尿症(Polyuria)</label>
                                <select class="single-select" id="a3">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label>多饮症(Polydipsia)</label>
                                <select class="single-select" id="a4">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                            <div class="form-group col-md-6">
                                <label>突然体重减轻(sudden weight loss)</label>
                                <select class="single-select" id="a5">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label>虚弱(weakness)</label>
                                <select class="single-select" id="a6">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                            <div class="form-group col-md-6">
                                <label>多食症(Polyphagia)</label>
                                <select class="single-select" id="a7">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label>生殖器鹅口疮(Genital thrush)</label>
                                <select class="single-select" id="a8">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                            <div class="form-group col-md-6">
                                <label>视力模糊(visual blurring)</label>
                                <select class="single-select" id="a9">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label>瘙痒(Itching)</label>
                                <select class="single-select" id="a10">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                            <div class="form-group col-md-6">
                                <label>易怒(Irritability)</label>
                                <select class="single-select" id="a11">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label>伤口愈合延迟(delayed healing)</label>
                                <select class="single-select" id="a12">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                            <div class="form-group col-md-6">
                                <label>部分麻痹(partial paresis)</label>
                                <select class="single-select" id="a13">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label>肌肉僵硬(muscle stiffness)</label>
                                <select class="single-select" id="a14">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                            <div class="form-group col-md-6">
                                <label>脱发(Alopecia)</label>
                                <select class="single-select" id="a15">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label>肥胖(Obesity)</label>
                            <select class="single-select" id="a16">
                                <option value="1">是</option>
                                <option value="0">否</option>
                            </select>
                        </div>
                        <button onclick="go()" class="btn btn-light m-1 btn-lg btn-block px-5">预测</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="../static/assets/js/jquery.min.js"></script>
    <script type="text/javascript">
        function go() {
            var a1 = document.getElementById('a1').value
            var a2 = document.getElementById('a2').value
            var a3 = document.getElementById('a3').value
            var a4 = document.getElementById('a4').value
            var a5 = document.getElementById('a5').value
            var a6 = document.getElementById('a6').value
            var a7 = document.getElementById('a7').value
            var a8 = document.getElementById('a8').value
            var a9 = document.getElementById('a9').value
            var a10 = document.getElementById('a10').value
            var a11 = document.getElementById('a11').value
            var a12 = document.getElementById('a12').value
            var a13 = document.getElementById('a13').value
            var a14 = document.getElementById('a14').value
            var a15 = document.getElementById('a15').value
            var a16 = document.getElementById('a16').value
            
            if (a1 === '' || a2 === '' || a3 === '' || a4 === '' || a5 === '' || a6 === '' || a7 === '' || 
                a8 === '' || a9 === '' || a10 === '' || a11 === '' || a12 === '' || a13 === '' || 
                a14 === '' || a15 === '' || a16 === '') {
                alert('请输入完整信息')
            } else {
                $.ajax({
                    url: "yc",
                    type: "post",
                    data: {
                        'Gender': a1,
                        'Age': a2,
                        'Polyuria': a3,
                        'Polydipsia': a4,
                        'sudden_weight_loss': a5,
                        'weakness': a6,
                        'Polyphagia': a7,
                        'Genital_thrush': a8,
                        'visual_blurring': a9,
                        'Itching': a10,
                        'Irritability': a11,
                        'delayed_healing': a12,
                        'partial_paresis': a13,
                        'muscle_stiffness': a14,
                        'Alopecia': a15,
                        'Obesity': a16
                    },
                    success(e) {
                        alert(e)
                    }
                })
            }
        }
    </script>
{% endblock %}